<template>
  <cjui-page-panel header="基础饼图2">
    <template #intro>
      添加了一些常见元素的样式效果。
    </template>
    
    <CjuiEchart :loading="false" :noData="false" :options="chartOption" class="h-full" />
  </cjui-page-panel>
</template>

<script lang="ts" setup>
const chartOption = {
  legend: {
    show: true
  },
  series: [
    {
      name: '饼图1',
      data: [{ name: '提示', value: 12 }, { name: '成功', value: 12 }, { name: '警告', value: 32 }, { name: '失败', value: 23 }],
      type: 'pie',
      center: ['50%', '40%'] ,
      radius: ['60%', '70%'] ,
    },
    {
      name: '饼图1',
      data: [{ name: '提示', value: 22 }, { name: '成功', value: 12 }, { name: '警告', value: 32 }, { name: '失败', value: 23 }],
      type: 'pie',
      center: ['50%', '40%'] ,
      radius: ['45%', '55%'] ,
      label: {
        show: false
      }
    },
    {
      name: '饼图1',
      data: [{ name: '提示', value: 12 }, { name: '成功', value: 12 }, { name: '警告', value: 12 }, { name: '失败', value: 23 }],
      type: 'pie',
      center: ['50%', '40%'] ,
      radius: ['30%', '40%'] ,
      label: {
        show: false
      }
    },
  ]
}
</script>
